import React, { useContext } from 'react'
import { ThemeContext } from './ThemeContext'
import 'remixicon/fonts/remixicon.css'

const ThemeToggle: React.FC = () => {
  const { isDark, toggleTheme } = useContext(ThemeContext)

  return (
    <button className="theme-toggle" onClick={toggleTheme}>
      <i
        className={isDark ? 'ri-sun-line text-xl' : 'ri-moon-line text-xl'}
      ></i>
    </button>
  )
}

export default ThemeToggle
